import React, { Suspense } from 'react';
import { BrowserRouter, Switch, Route } from 'react-router-dom';

// 路由配置
import routes from '../routes/index';
// 错误边界，及处理
import ErrorBoundary from '../components/err/ErrorBoundary';

function App() {
  return (
    <BrowserRouter>
      <div>
        <Switch>
          {routes.map((route, i) => (
            <Route
              exact
              key={i}
              path={route.path}
              render={(props) => {
                document.title = route.title;
                // <Suspense fallback={<div>Suspense</div>} />
                return (
                  <ErrorBoundary>
                    <Suspense fallback={<div />}>
                      <div>
                        <route.component {...props} />
                      </div>
                    </Suspense>
                  </ErrorBoundary>
                );
              }}
            />
          ))}
        </Switch>
      </div>
    </BrowserRouter>
  );
}

export default App;
